const slides = document.querySelectorAll('.slideshow img');
const prevBtn = document.querySelector('.prev');
const nextBtn = document.querySelector('.next');
const dots = document.querySelectorAll('.dots li');
let currentIndex = 0;
let autoPlayInterval;

// 切换图片
function changeSlide(index) {
    slides.forEach(slide => slide.style.opacity = 0);
    slides[index].style.opacity = 1;
    dots.forEach(dot => dot.classList.remove('active'));
    dots[index].classList.add('active');
}

// 自动播放
function autoPlay() {
    currentIndex = (currentIndex + 1) % slides.length;
    changeSlide(currentIndex);
}

// 按钮交互
prevBtn.addEventListener('click', () => {
    currentIndex = (currentIndex - 1 + slides.length) % slides.length;
    changeSlide(currentIndex);
});
nextBtn.addEventListener('click', () => {
    currentIndex = (currentIndex + 1) % slides.length;
    changeSlide(currentIndex);
});

// 指示点交互
dots.forEach((dot, index) => {
    dot.addEventListener('click', () => {
        currentIndex = index;
        changeSlide(currentIndex);
    });
});

// 鼠标悬停暂停
const slideshow = document.querySelector('.slideshow');
slideshow.addEventListener('mouseenter', () => clearInterval(autoPlayInterval));
slideshow.addEventListener('mouseleave', () => autoPlayInterval = setInterval(autoPlay, 3000));


/* -------------------- 待办列表逻辑 -------------------- */
// 初始化数据（5个示例任务）
let todoList = [
    { id: 1, title: "学习JavaScript", isCompleted: false },
    { id: 2, title: "完成轮播图", isCompleted: true },
    { id: 3, title: "整理待办逻辑", isCompleted: false },
    { id: 4, title: "测试交互功能", isCompleted: false },
    { id: 5, title: "优化样式", isCompleted: false }
];

// 渲染待办列表
function renderTodoList() {
    const todoUl = document.getElementById('todoList');
    todoUl.innerHTML = '';
    todoList.forEach(item => {
        const li = document.createElement('li');
        li.innerHTML = `
            <input type="checkbox" ${item.isCompleted ? 'checked' : ''} onchange="toggleComplete(${item.id})">
            <span style="${item.isCompleted ? 'text-decoration: line-through;' : ''}">${item.title}</span>
            <button onclick="deleteTodo(${item.id})">删除</button>
        `;
        todoUl.appendChild(li);
    });
}

// 切换完成状态
function toggleComplete(id) {
    todoList = todoList.map(item => 
        item.id === id ? { ...item, isCompleted: !item.isCompleted } : item
    );
    renderTodoList();
}

// 删除任务
function deleteTodo(id) {
    todoList = todoList.filter(item => item.id !== id);
    renderTodoList();
}

// 添加新任务
function addTodo() {
    const input = document.getElementById('newTodo');
    const title = input.value.trim();
    if (!title) return;
    todoList.push({ id: Date.now(), title, isCompleted: false });
    input.value = '';
    renderTodoList();
}


/* -------------------- 初始化 -------------------- */
window.onload = () => {
    // 初始化轮播图
    changeSlide(currentIndex);
    autoPlayInterval = setInterval(autoPlay, 3000);
    
    // 初始化待办列表
    renderTodoList();
};